import React from 'react';
import { Form, Input, Button, message } from 'antd';
import services from '../../../../services/api';

const InterfaceRelease = ({ form, value, closeModal, queryList }) => {
  const { name, id } = value;
  const { getFieldDecorator, validateFields } = form;

  const handleSubmit = (e) => {
    e.preventDefault();
    validateFields((err, { desc }) => {
      if (!err) {
        services.interfaceManage.onOff({ id, desc, onOrOff: 1 }).then(({ code, msg }) => {
          if (code === 0) {
            message.success(msg);
            queryList();
            closeModal();
          } else {
            message.error(msg);
          }
        });
      }
    });
  };

  const formItemLayout = {
    labelCol: {
      span: 6,
    },
    wrapperCol: {
      span: 18,
    },
  };

  return (
    <Form onSubmit={() => false} {...formItemLayout}>
      <Form.Item label='发布接口名'>{getFieldDecorator('name', { initialValue: name })(<Input disabled />)}</Form.Item>
      <Form.Item label='发布备注'>
        {getFieldDecorator('desc', { rules: [{ required: true, message: '请输入备注' }] })(
          <Input.TextArea placeholder='必填,不超过200字符' maxLength={200} />
        )}
      </Form.Item>
      <div style={{ marginTop: '20px', textAlign: 'center' }}>
        <Button className='marr10' onClick={() => closeModal()}>
          取消
        </Button>
        <Button type='primary' onClick={handleSubmit} autoFocus={true}>
          确定
        </Button>
      </div>
    </Form>
  );
};
export default Form.create()(InterfaceRelease);
